/* =======================================================================================================================
   css/shared.css - styles shared between all the games (chatcol, &c)
   =======================================================================================================================
   licenced under the Creative Commons Attribution 3.0 License: http://creativecommons.org/licenses/by/3.0/
   Jax, Jax Games (c) copyright Kroc Camen 2005-2007. http://code.google.com/p/jaxgames/
*/
@import "_global.css";
@import "_chat.css";

#body   {width: 642px; max-width: 640px; height: 429px; overflow: hidden;}
h1      {border-bottom: solid 1px #010801;}
h1 span {visibility: hidden;}

#cache  {position: absolute; top: -4999px; left: -4999px;}

#shared-gamearea 
        {position: absolute; top: 45px; left: 0; width: 512px; height: 384px; overflow: hidden;}

#page-title, #page-join, #page-game
        {width: 100%; height: 100%; overflow: hidden !important;}

.hv  {position: absolute;}
.hv1 {display: table; _position: relative; overflow: hidden;}
.hv2 {_position: absolute; _top: 50%; display: table-cell; vertical-align: middle;}
.hvt {_position: relative; _top: -50%;}

/* === player info ======================================================================================================= */
.player-status            {position: absolute; height: 21px; width: 512px; color: white;}
.player-info              {height: 18px; margin: 0; padding: 3px 5px 0 5px;}
.player-msg               {width: 512px; text-align: center;}

.player-name              {font-weight: bold;}

#player-status-them       {top: 0; background-image: url("../img/barthem.png");}
#player-status-them-info  {text-align: right;} 
#player-status-them-win   {float: left;}
#player-status-them-score {float: left; margin-left: 8px;}

#player-status-me         {top: 363px; height: 21px; background-image: url("../img/barme.png"); background-repeat: repeat-x;}
#player-status-me-win     {float: right; text-align: right;}
#player-status-me-score   {float: right; margin-right: 8px;}

/* === heads-up message ================================================================================================== */
#shared-headsup           {top: 45px; left: 0; width: 512px; height: 384px; z-index: 997;}
#shared-headsup .hv1      {width: 512px; height: 384px;}
#shared-headsup-bar       {padding: 0; font-size: 11px; text-align: center; color: white;
                           background-image: url("../img/mask.png"); overflow: hidden;
                           border: solid 2px #49d; border-left: 0; border-right: 0;}
#shared-headsup-text p    {padding: 10px 0 10px 0; margin-bottom: 0px;}

#shared-headsup a         {margin: 2px 8px 8px 2px; padding: 4px 15px 4px 15px; font-size: 12px; font-weight: bold;
                           color: #49d; text-align: center; text-decoration: none; border: solid 2px #49d;
                           -moz-border-radius: 15px; -webkit-border-radius: 15px;}
#shared-headsup a:hover,
#shared-headsup a:focus   {background-color: #49d; color: black;}

#shared-headsup input     {padding: 4px 8px 4px 8px; font: bold 14px "Courier New", monospace; color: #49d;
                           border: solid 2px #49d; -moz-border-radius: 15px; -webkit-border-radius: 15px;
                           background-color: black;}
#shared-key               {width: 250px; padding: 6px; font: bold 36px "Courier New", monospace !important;
                           text-align: center;}

/* === screen overlay ==================================================================================================== */
#system-status            {top: 0; left: 0; width: 640px; height: 429px; background-image: url("../img/mask.png");
                           z-index: 998;}
#system-status .hv1       {height: 450px; width: 640px;}
#system-status-text       {font-size: 11px; text-align: center; color: white;}

/* === error screen ====================================================================================================== */
#bsod        {display: none;}
.bsod        {position: absolute; top: 0; left: 0; width: 640px; height: 429px; z-index: 999;
	      text-align: center; background-color: #0000ac; -moz-opacity:  0.9;}
.bsod p      {padding: 175px 30px 0 30px; font: bold 12px "Courier New", monospace; color: white;}
.bsod strong {padding: 2px 5px 2px 5px; text-transform: uppercase; background-color: #ccc; color: #0000ac;}
.bsod a      {color: #ccc; text-decoration: none;}

/* === end of line ======================================================================================================= */